<template>
    <div class="content-header">
        <el-breadcrumb v-for="(item, index) in $useRoute.matched" :key="index">
            <el-breadcrumb-item>{{ item.meta.title }}</el-breadcrumb-item>
        </el-breadcrumb>
        <button @click="tuichu">退出登录</button>
        <!-- 获取用户的请求 -->
        <button @click="getrequest">其它处理的按钮</button>
        <img :src="$useInfo.avatar" alt="" width="20px">
        <span>{{ $useInfo.username }}</span>
    </div>
</template>
<script setup lang="ts" name="ContentHeader">
import { useRoute, useRouter } from "vue-router"
import { useInfo } from "@/store/data"
const $useInfo: any = useInfo()
const $useRoute = useRoute()
const $useRouter = useRouter()
function tuichu() {
    $useInfo.token = ""
    localStorage.removeItem("token")
    $useRouter.push({ path: "/login", query: { direct: $useRoute.path } })
}
function getrequest() {
    console.log("123");
}
</script>
<style lang="scss" scoped>
.content-header {
    position: fixed;
    background-color: red;
    height: 50px;
    width: calc(100vw - 260px);
    top: 0;
    left: 260px;
}
</style>